<!-- 
   计算属性computed
     语法:   
         const value = computed(()=>{
             return 100
         }) 
        1. 计算属性值可以在模块template中使用
      特点 :
         1. 计算属性依赖项变化会重新自动计算
         2. 缓存

-->
<template>
	<div>
		<h2>vue核心基础学习</h2>
		<p>{{ data }}</p>
		<button @click="bindAdd">加一</button>
	</div>
</template>

<script setup>
import { computed, ref } from 'vue'

const count = ref(1)

/**
 * 计算属性
 */
const data = computed(() => count.value * 100)

/**
 * 加一
 */
const bindAdd = () => count.value++
</script>

<style lang="css" scoped></style>
